import { forEach, startsWith } from 'lodash';
import { Row, Col, Input, Button, message, Table, Tabs } from 'antd';
import styles from '../TableList.less';

const TabPane = Tabs.TabPane;

function generateScoreMap(phaseCode, scheduleList, hadlerScoreInput, isPhaseFinished) {
  var scoreMap = {};
  scoreMap.columns = [];
  scoreMap.data = [];
  const columns = scoreMap.columns;
  const datas = scoreMap.data;
  columns.push({
    title: '抽签号',
    key: 'chouqianhao',
    className: styles.nopadding,
    width: 80,
    align: 'right',
    dataIndex: 'posName',
    render: value =>
      value === '轮空' ? (
        <span style={{ fontWeight: 'bold', fontSize: 18, color: 'red' }}>轮空</span>
      ) : (
        <span style={{ fontWeight: 'bold', fontSize: 18 }}>{value}</span>
      ),
  });
  var count = 0;
  switch (scheduleList.length) {
    case 2:
      count = 3;
      break;
    case 4:
      count = 4;
      break;
    case 8:
      count = 5;
      break;
    case 16:
      count = 6;
      break;
  }
  for (var i = 1; i <= count; i++) {
    columns.push({
      title: 'line' + i,
      dataIndex: 'line' + i,
      className: styles.nopadding,
      width: 80,
      render: value => {
        if (value && value.style === 'fr')
          return (
            <div
              style={{
                height: '28px',
                borderStyle: 'solid solid none none',
                borderWidth: '2px',
                borderColor: '#808080',
                textAlign: 'center',
              }}
            >
              {value.posName ? (
                <span style={{ fontWeight: 'bold', fontSize: 18, textAlign: 'center' }}>
                  {value.posName}
                </span>
              ) : (
                <span>&nbsp;</span>
              )}
            </div>
          );
        else if (value && value.style === 'br')
          return (
            <div
              style={{
                height: '28px',
                borderStyle: 'none solid solid none',
                borderWidth: '2px',
                borderColor: '#808080',
                textAlign: 'center',
              }}
            >
              {value.posName ? (
                <span style={{ fontWeight: 'bold', fontSize: 18, textAlign: 'center' }}>
                  {value.posName}
                </span>
              ) : (
                <span>&nbsp;</span>
              )}
            </div>
          );
        else if (value && value.style === 'r')
          return (
            <div
              style={{
                height: '28px',
                borderStyle: 'none solid none none',
                borderWidth: '2px',
                borderColor: '#808080',
                textAlign: 'center',
              }}
            >
              {value.posName ? (
                <span style={{ fontWeight: 'bold', fontSize: 18, textAlign: 'center' }}>
                  {value.posName}
                </span>
              ) : (
                <span>&nbsp;</span>
              )}
            </div>
          );
        else if (value && value.style === 'b')
          return (
            <div
              style={{
                height: '28px',
                borderStyle: 'none none solid none',
                borderWidth: '2px',
                borderColor: '#808080',
                textAlign: 'center',
              }}
            >
              {value.posName ? (
                <span style={{ fontWeight: 'bold', fontSize: 18, textAlign: 'center' }}>
                  {value.posName}
                </span>
              ) : (
                <span>&nbsp;</span>
              )}
            </div>
          );
        else if (value && value.style === 'f')
          return (
            <div
              style={{
                height: '28px',
                borderStyle: 'solid none none none',
                borderWidth: '2px',
                borderColor: '#808080',
                textAlign: 'center',
              }}
            >
              {value.posName ? (
                <span style={{ fontWeight: 'bold', fontSize: 18, textAlign: 'center' }}>
                  {value.posName}
                </span>
              ) : (
                <span>&nbsp;</span>
              )}
            </div>
          );
        else if (value && value.posName)
          return (
            <div style={{ fontWeight: 'bold', fontSize: 18, textAlign: 'center' }}>
              {value.posName}
            </div>
          );
      },
    });
  }

  var index = 0;
  scheduleList.forEach(element => {
    if (phaseCode && phaseCode !== element.phaseCode) {
      return;
    }
    element.isPhaseFinished = isPhaseFinished;
    //第一行
    const userLine1 = {};
    datas.push(userLine1);
    //第二行
    const userLine2 = {};
    userLine2['line1'] = { style: 'fr' };
    datas.push(userLine2);
    //第三行
    const userLine3 = {};
    userLine3['line1'] = { style: 'br' };
    datas.push(userLine3);
    //第四行
    const userLine4 = {};
    datas.push(userLine4);
    if (element.gamePosName1 || element.gamePosName2) {
      if (element.gamePosName1) {
        userLine1['posName'] = element.gamePosName1 + ' ' + generateAuth(element.athlethList1);
      } else {
        userLine1['posName'] = '轮空';
      }

      if (element.gamePosName2) {
        userLine3['posName'] = element.gamePosName2 + ' ' + generateAuth(element.athlethList2);
      } else {
        userLine3['posName'] = '轮空';
      }
    } else {
      userLine1['posName'] = '待定';
      userLine3['posName'] = '待定';
    }

    switch (index) {
      case 0:
        userLine3['line2'] = { style: 'fr' };
        userLine4['line2'] = { style: 'r' };
        userLine2['line2'] = { posName: getWinData(element, hadlerScoreInput) };
        if (element.parentSchedule) {
          userLine4['line3'] = { posName: getWinData(element.parentSchedule, hadlerScoreInput) };
        }
        break;
      case 1:
        userLine2['line2'] = { style: 'br' };
        userLine1['line2'] = { style: 'r' };
        if (count > 3) {
          userLine1['line3'] = { style: 'fr' };
          userLine2['line3'] = { style: 'r' };
          userLine3['line3'] = { style: 'r' };
          userLine4['line3'] = { style: 'r' };
        } else if (count === 3) {
          userLine1['line3'] = { style: 'f' };
        } else {
          userLine1['line3'] = { style: 'b' };
        }
        userLine2['line2'].posName = getWinData(element, hadlerScoreInput);
        if (element.parentSchedule.parentSchedule) {
          userLine4['line4'] = {
            posName: getWinData(element.parentSchedule.parentSchedule, hadlerScoreInput),
          };
        }
        break;
      case 2:
        userLine3['line2'] = { style: 'fr' };
        userLine4['line2'] = { style: 'r' };
        if (count > 3) {
          userLine1['line3'] = { style: 'r' };
          userLine2['line3'] = { style: 'r' };
          userLine3['line3'] = { style: 'r' };
          userLine4['line3'] = { style: 'br' };
        }
        if (count > 4) {
          userLine1['line4'] = { style: 'fr' };
          userLine2['line4'] = { style: 'r' };
          userLine3['line4'] = { style: 'r' };
          userLine4['line4'] = { style: 'r' };
        } else {
          userLine1['line4'] = { style: 'f' };
        }
        userLine2['line2'] = { posName: getWinData(element, hadlerScoreInput) };
        if (element.parentSchedule) {
          userLine4['line3'].posName = getWinData(element.parentSchedule, hadlerScoreInput);
        }
        break;
      case 3:
        userLine2['line2'] = { style: 'br' };
        userLine1['line2'] = { style: 'r' };
        if (count > 4) {
          userLine1['line4'] = { style: 'r' };
          userLine2['line4'] = { style: 'r' };
          userLine3['line4'] = { style: 'r' };
          userLine4['line4'] = { style: 'r' };
        }
        userLine2['line2'].posName = getWinData(element, hadlerScoreInput);
        if (element.parentSchedule.parentSchedule.parentSchedule) {
          userLine4['line5'] = {
            posName: getWinData(
              element.parentSchedule.parentSchedule.parentSchedule,
              hadlerScoreInput
            ),
          };
        }
        break;
      case 4:
        userLine3['line2'] = { style: 'fr' };
        userLine4['line2'] = { style: 'r' };
        if (count > 4) {
          userLine1['line4'] = { style: 'r' };
          userLine2['line4'] = { style: 'r' };
          userLine3['line4'] = { style: 'r' };
          userLine4['line4'] = { style: 'r' };
        }
        if (count > 5) {
          userLine1['line5'] = { style: 'fr' };
          userLine2['line5'] = { style: 'r' };
          userLine3['line5'] = { style: 'r' };
          userLine4['line5'] = { style: 'r' };
        } else {
          userLine1['line5'] = { style: 'b' };
        }
        userLine2['line2'] = { posName: getWinData(element, hadlerScoreInput) };
        if (element.parentSchedule) {
          userLine4['line3'] = { posName: getWinData(element.parentSchedule, hadlerScoreInput) };
        }
        break;
      case 5:
        userLine2['line2'] = { style: 'br' };
        userLine1['line2'] = { style: 'r' };
        if (count > 3) {
          userLine1['line3'] = { style: 'fr' };
          userLine2['line3'] = { style: 'r' };
          userLine3['line3'] = { style: 'r' };
          userLine4['line3'] = { style: 'r' };
        }
        if (count > 4) {
          userLine1['line4'] = { style: 'r' };
          userLine2['line4'] = { style: 'r' };
          userLine3['line4'] = { style: 'r' };
          userLine4['line4'] = { style: 'br' };
        }
        if (count > 5) {
          userLine1['line5'] = { style: 'r' };
          userLine2['line5'] = { style: 'r' };
          userLine3['line5'] = { style: 'r' };
          userLine4['line5'] = { style: 'r' };
        }
        userLine2['line2'].posName = getWinData(element, hadlerScoreInput);
        if (element.parentSchedule.parentSchedule) {
          userLine4['line4'].posName = getWinData(
            element.parentSchedule.parentSchedule,
            hadlerScoreInput
          );
        }
        break;
      case 6:
        userLine3['line2'] = { style: 'fr' };
        userLine4['line2'] = { style: 'r' };
        if (count > 3) {
          userLine1['line3'] = { style: 'r' };
          userLine2['line3'] = { style: 'r' };
          userLine3['line3'] = { style: 'r' };
          userLine4['line3'] = { style: 'br' };
        }
        if (count > 5) {
          userLine1['line5'] = { style: 'r' };
          userLine2['line5'] = { style: 'r' };
          userLine3['line5'] = { style: 'r' };
          userLine4['line5'] = { style: 'r' };
        }

        userLine2['line2'] = { posName: getWinData(element, hadlerScoreInput) };
        if (element.parentSchedule) {
          userLine4['line3'].posName = getWinData(element.parentSchedule, hadlerScoreInput);
        }
        break;
      case 7:
        userLine2['line2'] = { style: 'br' };
        userLine1['line2'] = { style: 'r' };
        if (count > 5) {
          userLine1['line5'] = { style: 'r' };
          userLine2['line5'] = { style: 'r' };
          userLine3['line5'] = { style: 'r' };
          userLine4['line5'] = { style: 'r' };
        }
        userLine2['line2'].posName = getWinData(element, hadlerScoreInput);
        break;
      case 8:
        userLine3['line2'] = { style: 'fr' };
        userLine4['line2'] = { style: 'r' };
        if (count > 5) {
          userLine1['line5'] = { style: 'r' };
          userLine2['line5'] = { style: 'r' };
          userLine3['line5'] = { style: 'r' };
          userLine4['line5'] = { style: 'r' };
        }
        if (count >= 6) {
          userLine1['line6'] = { style: 'b' };
        }
        userLine2['line2'] = { posName: getWinData(element, hadlerScoreInput) };
        if (element.parentSchedule) {
          userLine4['line3'] = { posName: getWinData(element.parentSchedule, hadlerScoreInput) };
        }
        if (element.parentSchedule.parentSchedule.parentSchedule) {
          userLine1['line6'].posName = getWinData(
            element.parentSchedule.parentSchedule.parentSchedule.parentSchedule,
            hadlerScoreInput
          );
        }
        break;
      case 9:
        userLine2['line2'] = { style: 'br' };
        userLine1['line2'] = { style: 'r' };
        if (count > 3) {
          userLine1['line3'] = { style: 'fr' };
          userLine2['line3'] = { style: 'r' };
          userLine3['line3'] = { style: 'r' };
          userLine4['line3'] = { style: 'r' };
        }
        if (count > 5) {
          userLine1['line5'] = { style: 'r' };
          userLine2['line5'] = { style: 'r' };
          userLine3['line5'] = { style: 'r' };
          userLine4['line5'] = { style: 'r' };
        }
        userLine2['line2'].posName = getWinData(element, hadlerScoreInput);
        if (element.parentSchedule.parentSchedule) {
          userLine4['line4'] = {
            posName: getWinData(element.parentSchedule.parentSchedule, hadlerScoreInput),
          };
        }
        break;
      case 10:
        userLine3['line2'] = { style: 'fr' };
        userLine4['line2'] = { style: 'r' };
        if (count > 3) {
          userLine1['line3'] = { style: 'r' };
          userLine2['line3'] = { style: 'r' };
          userLine3['line3'] = { style: 'r' };
          userLine4['line3'] = { style: 'br' };
        }
        if (count > 4) {
          userLine1['line4'] = { style: 'fr' };
          userLine2['line4'] = { style: 'r' };
          userLine3['line4'] = { style: 'r' };
          userLine4['line4'] = { style: 'r' };
        }
        if (count > 5) {
          userLine1['line5'] = { style: 'r' };
          userLine2['line5'] = { style: 'r' };
          userLine3['line5'] = { style: 'r' };
          userLine4['line5'] = { style: 'r' };
        }
        userLine2['line2'] = { posName: getWinData(element, hadlerScoreInput) };
        if (element.parentSchedule) {
          userLine4['line3'].posName = getWinData(element.parentSchedule, hadlerScoreInput);
        }
        break;
      case 11:
        userLine2['line2'] = { style: 'br' };
        userLine1['line2'] = { style: 'r' };
        if (count > 4) {
          userLine1['line4'] = { style: 'r' };
          userLine2['line4'] = { style: 'r' };
          userLine3['line4'] = { style: 'r' };
          userLine4['line4'] = { style: 'r' };
        }
        if (count > 5) {
          userLine1['line5'] = { style: 'r' };
          userLine2['line5'] = { style: 'r' };
          userLine3['line5'] = { style: 'r' };
          userLine4['line5'] = { style: 'br' };
        }
        userLine2['line2'].posName = getWinData(element, hadlerScoreInput);
        if (element.parentSchedule.parentSchedule.parentSchedule) {
          userLine4['line5'].posName = getWinData(
            element.parentSchedule.parentSchedule.parentSchedule,
            hadlerScoreInput
          );
        }
        break;
      case 12:
        userLine3['line2'] = { style: 'fr' };
        userLine4['line2'] = { style: 'r' };
        if (count > 4) {
          userLine1['line4'] = { style: 'r' };
          userLine2['line4'] = { style: 'r' };
          userLine3['line4'] = { style: 'r' };
          userLine4['line4'] = { style: 'r' };
        }
        userLine2['line2'] = { posName: getWinData(element, hadlerScoreInput) };
        if (element.parentSchedule) {
          userLine4['line3'] = { posName: getWinData(element.parentSchedule, hadlerScoreInput) };
        }
        break;
      case 13:
        userLine2['line2'] = { style: 'br' };
        userLine1['line2'] = { style: 'r' };
        if (count > 3) {
          userLine1['line3'] = { style: 'fr' };
          userLine2['line3'] = { style: 'r' };
          userLine3['line3'] = { style: 'r' };
          userLine4['line3'] = { style: 'r' };
        }
        if (count > 4) {
          userLine1['line4'] = { style: 'r' };
          userLine2['line4'] = { style: 'r' };
          userLine3['line4'] = { style: 'r' };
          userLine4['line4'] = { style: 'br' };
        }
        userLine2['line2'].posName = getWinData(element, hadlerScoreInput);
        if (element.parentSchedule.parentSchedule) {
          userLine4['line4'].posName = getWinData(
            element.parentSchedule.parentSchedule,
            hadlerScoreInput
          );
        }
        break;
      case 14:
        userLine3['line2'] = { style: 'fr' };
        userLine4['line2'] = { style: 'r' };
        if (count > 3) {
          userLine1['line3'] = { style: 'r' };
          userLine2['line3'] = { style: 'r' };
          userLine3['line3'] = { style: 'r' };
          userLine4['line3'] = { style: 'br' };
        }
        userLine2['line2'] = { posName: getWinData(element, hadlerScoreInput) };
        if (element.parentSchedule) {
          userLine4['line3'].posName = getWinData(element.parentSchedule, hadlerScoreInput);
        }
        break;
      case 15:
        userLine2['line2'] = { style: 'br' };
        userLine1['line2'] = { style: 'r' };
        userLine2['line2'].posName = getWinData(element, hadlerScoreInput);
        if (element.parentSchedule) {
        }
        break;
    }

    index++;
  });
  return scoreMap;
}

function generateAuth(list) {
  return list
    .map(value => {
      return value.userName;
    })
    .join(',');
}

function getWinData(element, hadlerScoreInput) {
  const { scoreList } = element;
  var pos1Win = 0;
  var pos2Win = 0;
  var winFlag = false;
  scoreList.forEach(value => {
    if (!(pos1Win > scoreList.length / 2 || pos2Win > element.scoreList.length / 2)) {
      if (value.score1 > value.score2) {
        pos1Win++;
      } else {
        pos2Win++;
      }
    }
    if (pos1Win > scoreList.length / 2 || pos2Win > element.scoreList.length / 2) {
      winFlag = true;
    }
  });

  return element.isNull ? (
    element.gamePosCode1 ? (
      element.gamePosName1
    ) : (
      element.gamePosName2
    )
  ) : element.winPos ? (
    element.winPos === element.gamePosCode1 ? (
      <Button
        type="ghost"
        style={{
          height: '90%',
          border: 'none',
          fontWeight: 'bold',
          fontSize: 18,
          textAlign: 'center',
        }}
        onClick={() => hadlerScoreInput(element)}
      >
        {'(' + pos1Win + ':' + pos2Win + ')' + element.gamePosName1}
      </Button>
    ) : (
      <Button
        type="ghost"
        style={{
          height: '90%',
          border: 'none',
          fontWeight: 'bold',
          fontSize: 18,
          textAlign: 'center',
        }}
        onClick={() => hadlerScoreInput(element)}
      >
        {'(' + pos1Win + ':' + pos2Win + ')' + element.gamePosName2}
      </Button>
    )
  ) : element.isVirtual ? (
    ''
  ) : (
    <div />
  );
}

export function generateTreeTable(
  phaseCode,
  zhixuChouqianList,
  handleChange,
  hadlerScoreInput,
  isPhaseFinished
) {
  const { tabList, list, curPage } = zhixuChouqianList;

  const scoreMap = generateScoreMap(phaseCode, list, hadlerScoreInput, isPhaseFinished);
  const tableDiv = (
    <Table
      key="treeTable"
      pagination={false}
      size="small"
      showHeader={false}
      dataSource={scoreMap.data}
      columns={scoreMap.columns}
    />
  );
  if (tabList && tabList.length > 1) {
    return (
      <Tabs tabPosition="left" size="small" onChange={handleChange}>
        {tabList.map(
          value =>
            curPage === value.seq ? (
              <TabPane tab={`第${value.name}区`} key={value.seq}>
                {tableDiv}
              </TabPane>
            ) : (
              <TabPane tab={`第${value.name}区`} key={value.seq} />
            )
        )}
      </Tabs>
    );
  } else {
    return tableDiv;
  }
}
